﻿//for changing font size
$("#slider").slider(
{
    value: 30,
    min: 0,
    max: 100,
    step: 1,
    slide: function (event, ui) {
        $("#slider-value").html(ui.value);
        var fs = $("#slider-value").html();
        $("td > span").css("font-size", fs + "px");
    }

}
);
// for changing color
function hexFromRGB(r, g, b) {
    var hex = [
      r.toString(16),
      g.toString(16),
      b.toString(16)
    ];
    $.each(hex, function (nr, val) {
        if (val.length === 1) {
            hex[nr] = "0" + val;
        }
    });
    return hex.join("").toUpperCase();
}
function refreshSwatch() {
    var red = $("#red").slider("value"),
      green = $("#green").slider("value"),
      blue = $("#blue").slider("value"),
      hex = hexFromRGB(red, green, blue);
    $("#swatch").css("background-color", "#" + hex);
    $("td > span").css("color", "#" + hex);
}
$(function () {
    $("#red, #green, #blue").slider({
        orientation: "horizontal",
        range: "min",
        max: 255,
        value: 127,
        slide: refreshSwatch,
        change: refreshSwatch
    });
    $("#red").slider("value", 255);
    $("#green").slider("value", 140);
    $("#blue").slider("value", 60);
});

function CreateShadow() {
    var ox = document.getElementById('offsetx').value;
    var oy = document.getElementById('offsety').value;
    var bd = document.getElementById('blur').value;
    var cl = document.getElementById('color').value;
    $("td > span").css("text-shadow", ox + "px " + oy + "px " + bd + "px " + cl);
}
//for accessing final style
$("td").click(function () {
    var html = $(this).html();
    $("#code").text(html);
    $('#code').show();
    $('html,body').animate({ scrollTop: 0 });
});
